new function() {
	var ws = null;
	var connected = false;

    var username;
    var userVal;
	var connectionStatus;
	var sendMessage;
	
	var connectButton;
	var disconnectButton; 
	var sendButton;

	var open = function() {
        var url  = 'w' + 's:/' + '/' + document.domain + ':9' + '50' + '2'; 
        
        userVal = username.val();
        if (!$.trim(userVal)) {
            username.removeAttr('disabled');
            connectionStatus.text('CLOSE');
            alert('用户名称必须填写');
            return;
        }
        
		ws = new WebSocket(url);
		ws.onopen = onOpen;
		ws.onclose = onClose;
		ws.onmessage = onMessage;
		ws.onerror = onError;
       
		connectionStatus.text('OPENING ...');
		username.attr('disabled', 'disabled');
		connectButton.hide();
		disconnectButton.show();
	}
	
	var close = function() {
		if (ws) {
			ws.close();
		}
		$('#onlineNumber').html('0');
        var t =$('.online').find('ol');
        t.html('');
		connected = false;
		connectionStatus.text('CLOSED');

		username.removeAttr('disabled');
		connectButton.show();
		disconnectButton.hide();
		sendMessage.attr('disabled', 'disabled');
		sendButton.attr('disabled', 'disabled');
	}
	
	var clearLog = function() {
		$('#messages').html('');
	}
	
	var onOpen = function() {
        
		connected = true;
		connectionStatus.text('OPENED');
		sendMessage.removeAttr('disabled');
		sendButton.removeAttr('disabled');
        
        ws.send(getMsg(userVal, '', 'connect'));
	};
	
	var onClose = function() {
		ws = null;
	};
	
    var displayOnline = function (o) {
        $('#onlineNumber').html(o.count);
        var _len = o.list.length;
        var t =$('.online').find('ol');
        t.html('');
        for (var i in o['list']) {
            t.append('<li style="width:100px;float:left">' + o['list'][i]['username'] + '</li>');
        }
    }
    
	var onMessage = function(event) {
        var data = JSON.parse(event.data);
        displayOnline(data);console.log(data.msg);
		addMessage(data.msg);
        
	};
	
	var onError = function(event) {
		alert(event.data);
	}
	
	var addMessage = function(data, type) {
		var msg = $('<pre>').text(data);
		if (type === 'SENT') {
			msg.addClass('sent');
		} else {
            msg.addClass('get');
        }
		var messages = $('#messages');
		messages.append(msg);
		
		var msgBox = messages.get(0);
		while (msgBox.childNodes.length > 1000) {
			msgBox.removeChild(msgBox.firstChild);
		}
		msgBox.scrollTop = msgBox.scrollHeight;
	}

    var getMsg = function (username, msg, type, fd) {
        if (!!!fd) fd = 0;
        return JSON.stringify({username : username, msg : msg, type : type, fd : fd});
    }
    
	WebSocketClient = {
		init: function() {
			serverUrl = $('#serverUrl');
			connectionStatus = $('#connectionStatus');
			sendMessage = $('#sendMessage');
			username = $('#username');
            userVal = username.val();
            
			connectButton = $('#connectButton');
			disconnectButton = $('#disconnectButton'); 
			sendButton = $('#sendButton');
			
			connectButton.click(function(e) {
				close();
				open();
			});
		
			disconnectButton.click(function(e) {
				close();
			});
			
			sendButton.click(function(e) {
				var msg = $('#sendMessage').val();
                var sendMsg = getMsg(userVal, msg, 'SEND');
				addMessage(userVal + ':' + msg, 'SENT');
                
                sendMessage.val('');
				ws.send(sendMsg);
			});
			
			$('#clearMessage').click(function(e) {
				clearLog();
			});
			
			var isCtrl;
			sendMessage.keyup(function (e) {
				if(e.which == 17) isCtrl=false;
			}).keydown(function (e) {
				if(e.which == 17) isCtrl=true;
				if(e.which == 13 ) {
					sendButton.click();
					return false;
				}
			});
		}
	};
}

new function () {
    var ws,url  = 'w' + 's:/' + '/' + document.domain + ':9' + '50' + '2';
    
    this.start = function () {
        this.fn.init();
    }
    
    this.fn = {
        init : function () {
            
        },
        open : function (e) {
            
        },
        error : function (e) {
            console.error(e.data);
        },
        close : function () {
            ws.close();
            ws = null;
        },
        message : function (e) {
            
        }
    }
    
    
    
}



$(function() {
	WebSocketClient.init();
});